<template>
    <div>
        <img src="./assets/logo.png" alt="logo">
        <School ref="sch"></School>
        <h2 v-text="msg" ref="title"></h2>
        <button @click="showDOM" ref="btn">点我输出上方的DOM元素</button>
    </div>
</template>

<script>
    import School from './components/School.vue'

    export default {
        name:'APP',
        components:{
            School
        },
        data() {
            return {
                msg:'欢迎学习vue',
            }
        },
        methods: {
            showDOM(){
                console.log(this.$refs.title);//DOM元素
                console.log(this.$refs.btn);//DOM元素
                console.log(this.$refs.sch);//school组件的实例对象
            }
        },
    
}
</script>

<style>

</style>
